<template>
    <view style="position: relative;">

        <view :style="{height:screenHeight+'px'}">
            <image :src="huodongimg" mode="scaleToFill"></image>
            <image class="qrcode" :src="qrcode" mode="scaleToFill" v-if="qrcode"></image>
        </view>

        <view class="share-wrap">
            <button class="share-content" open-type='share'>
                <!-- <view class="share-content" @click="share"> -->
                <image src="/pagesB/static/mine/invite/icon-share.png" mode="scaleToFill"></image>
                <text>好友/群</text>
                <!-- </view> -->
            </button>

            <view class="share-content" @click="save">
                <image src="/pagesB/static/mine/invite/icon-share2.png" mode="scaleToFill"></image>
                <text>保存分享图片</text>
            </view>

        </view>
        <!-- 登录弹窗 -->
        <!-- <LoginMask></LoginMask> -->
    </view>
</template>

<script>
import * as loginApi from '@/common/apis/login-api'
import LoginMask from '@/components/layout/login-mask.vue';
const GLOBAL_CONFIG = require('@/common/config');

export default {
    components: {
        LoginMask,
    },
    data() {
        return {
            screenHeight: "",
            qrcode: '',
            huodongimg: this.baseImageUrl+'uni_rental/huoodng.png',
        }
    },
    computed: {
        userInfo() {
            return this.$store.state.user.userInfo;
        },
        memberNo() {
            return this.userInfo.customerId;
        },
        tenantId() {
            return this.$store.state.user.tenantCode;
        },
    },
    onLoad() {
        this.screenHeight = uni.getSystemInfoSync().windowHeight
        this.getqrcode();
    },
    onShareAppMessage(res) {
        console.log(res);
        return {
            title: '司机端',
            path: `pages/home/home?scene=${this.memberNo}&customerId=${this.$store.state.user.userInfo.customerId}&deptId=${this.$store.state.user.deptId}`,
            imageUrl: '/static/huoodng.png',
        };
    },
    methods: {
        async getqrcode() {
            loginApi.qrcode({
                url: 'pages/home/home',
                memberNo: this.memberNo,// this.userInfo.customerId,
                code: this.tenantId,
            }).then(res => {
                this.qrcode = GLOBAL_CONFIG.baseImageUrl + res
            }).catch(err => {
                uni.showToast({ title: err, icon: 'error' });
            })
        },
        share() {
            uni.share()
        },
        getImageInfo(src) {
            return new Promise((resolve) => {
                uni.getImageInfo({
                    src: src,
                    success(res) {
                        resolve(res);
                    },
                })
            });
        },
        async save() {
            uni.showToast({ title: '保存中...', icon: 'loading' });
            const { path } = await this.getImageInfo(this.qrcode);
            uni.saveImageToPhotosAlbum({
                filePath: path,
                complete(res) {
                    uni.showToast({ title: '保存成功', icon: 'success' });
                    console.log(res);
                },
            })
        },
    },
}
</script>

<style lang="scss" scoped>
.qrcode{
	width: 200upx;
	height: 200upx;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.bottom-share{
	border: 0 !important;
	background: red !important;
	border-radius: 30;
}
	image {
		width: 100%;
		height: 100%;
	}
	
	.share-wrap{
		width: 100%;
		position: absolute;
		bottom: 130upx;
		@include flex;
		justify-content: space-between;
		
		.share-content{
			@include flex;
			align-items: center;
			border-radius: 90upx;
			background-color: $white;
			padding: 10upx 30upx;
			margin: 0 40upx;
			
			image{
				width: 60upx;
				height: 60upx;
				
			}
			
			text{
				color: $black33;
				font-size: 28upx;
				margin-left: 10upx;
			}
		}
	}
</style>
